<%@ page language="java" contentType="text/html;charset=UTF-8" %>
<%@ include file="/static/include/taglib.jsp" %>
<!DOCTYPE html>
<html>
<head>
    <link href="${ctxStatic}/layui/css/layui.css" rel="stylesheet"/>
    <link href="${ctxStatic}/css/kpiui.css" rel="stylesheet"/>
    <script src="${ctxStatic}/js/jquery-1.8.3.min.js?v=2.0" type="text/javascript"></script>
    <script src="${ctxStatic}/layui/layui.all.js" type="text/javascript"></script>
    <script src="${ctxStatic}/js/common.js" type="text/javascript"></script>

</head>
<body>
<div class="tabregion">
    <div class="serchcontent">
        <div class="search">
            <div class="layui-form">
                <table>
                    <tr>
                        <td class="td_select template">
                            <select id="template" lay-filter="templateId" style="width: 240px">

                            </select>

                        </td>

                        <td style="text-align: center;width:250px">
                            <button class="button" onclick="searchData()"><img
                                    src="${ctxStatic}/images/button/chaxun.png" style="width:20px">查询
                            </button>
                            <button class="button" onclick="addTitle()"> 保存
                            </button>
                            <button class="button" onclick="exportWord()">
                                导出
                            </button>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
    </div>
    <input placeholder="请输入名称" id="title"
           style="     margin: 10px; width: 700px; color: rgba(255,255,255,0.80);background: #2A68A6;border: 1px solid #589DF5;">
    <iframe id="lookData" style="width: 100%;min-height: 600px ;border: none"></iframe>
</div>

<script>
    var names = [];
    $(function () {
        var form;
        layui.use('form', function () {
            form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
            form.render();
            var node = $('.template');
            node.find('.layui-select-title').css('width', '300px');
        });


        form.on('select(month)', function (data) {
            $('#monthValue').text(data.value);
        });

        getTemplate();
    })


    function save() {
        $.ajax({
            type: "POST",
            url: "saveName",
            data: {name: $('#name').val(), templateid: $('#template').val()},
            beforeSend: function (XHR) {

            },
            success: function (data) {
                top.mylayui.msg('操作成功', {icon: 1});

            },
            complete: function (XHR) {

            },
            error: function () {

            }
        });


    }


    function addTitle() {
        var templateId = $("#template").val();
        $.ajax({
            type: "POST",
            url: "add_title",
            data: {title: $('#title').val(), templateId: templateId},
            beforeSend: function (XHR) {

            },
            success: function (data) {
                layer.msg('保存成功', {icon: 1})
            },
            complete: function (XHR) {

            },
            error: function () {

            }
        });

    }

    function searchData() {

        var value = $('#template').val();


        $('#lookData').attr('src', 'look?templateid=' + value)


        $.ajax({
            type: "POST",
            url: "get_title",
            data: {templateId:value},
            beforeSend: function (XHR) {

            },
            success: function (data) {
                data = eval('(' + data + ')');
                if (data.length > 0) {

                    $("#title").val(data[0].title);

                } else {
                    $('#title').val("");

                }

            },
            complete: function (XHR) {

            },
            error: function () {

            }
        });

    }
    function exportWord() {
        var templateId = $("#template").val();


        var title = $("#title").val();
        // top.mylayui.open({
        //     type: 2,
        //     title: '执法考核下载',
        //     shadeClose: true,
        //     shade: 0.5,
        //     area: ['1px', '1px'],
        //     content: 'lawass/law_kp_edit_export?templateid='+templateId+'&title=' + title
        // });
        // mylayui.closeAll();
        // var url = 'work_kp_exportword?templateId='+templateId+'&title=' + title;
        window.open('./law_kp_edit_export?templateid='+templateId+'&title=' + title);
        // window.document.location.href='workass/work_kp_exportword?templateId='+templateId+'&title=' + title;
    }

    function getTemplate() {

        $.ajax({
            type: "POST",
            url: "get_list",
            beforeSend: function (XHR) {

            },
            success: function (data) {
                data = eval('(' + data + ')');

                $("#template").find("option").remove();

                for (var i = 0; i < data.data.length; i++) {
                    var element = data.data[i]

                    $("#template").append("<option value=" + element.templateid + ">" + element.templatename + "</option>");

                    names.push({id: element.templateid, name: element.dataname})
                }
                layui.use('form', function () {
                    form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
                    form.render();
                    var node = $('.template');
                    node.find('.layui-select-title').css('width', '300px');
                });

            },
            complete: function (XHR) {

            },
            error: function () {

            }
        });

    }
</script>
</body>
</html>
